<template>
  <!-- 柱状图 -->
  <div>
    <div id="chart_Bar"
         ref="chart_Bar"
         style="width:100%;height:100%"></div>
  </div>
</template>

<script>
export default {
  name: 'Chart_Bar',
  props: {
    option: {
      type: Object,
      required: true,
      // default: () => ()
    }
  },
  mounted () {
    this.makechart()
  },
  methods: {
    makechart () {
      const chart_Bar = this.$echarts.init(this.$refs.chart_Bar)

      chart_Bar.setOption(this.option)

      //图表跟随屏幕自适应
      window.addEventListener('resize', () => chart_Bar.resize()
      )
    }
  }
}
</script>